<style scoped>
  .expand-row{
    margin-bottom: 16px;
  }
  .lyx-table-btn{
    margin-right: 5px;
    margin-bottom: 2px;
  }
  .title-size {
    font-weight: bold;
    font-size: 1rem;
  }
</style>
<template>
  <div>
      <Form label-position="right" :label-width="100" style="position: relative;" :model="formDate">
        <Row class="mb20">
          <Col span="13" class="ivu-form-item-label title-size">廉租房变更申请</Col>
        </Row>
        <Row class="mb20">
          <Col span="7" class="ivu-form-item-label">变更原因：</Col>
          <Col span="12" offset="1" class="ivu-form-item-content">
            <div style="width: 100%;float: left">
              <CheckboxGroup v-model="committeeChangeReasonArr" v-for="item in ruleData.committeeChangeReasonList" v-bind:key="item.index">
                <Checkbox :label="item.committeeChangeReasonCode" style="width: max-content;float: left">{{item.committeeChangeReasonName}}</Checkbox>
              </CheckboxGroup>
            </div>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="7" class="ivu-form-item-label">变更原因说明：</Col>
          <Col span="9" offset="1" class="ivu-form-item-content">
            <Input v-model="formDate.committeeChangeReason" type="textarea" :rows="4"/>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="7" class="ivu-form-item-label">变更月份：</Col>
          <Col span="9" offset="1">
            <Select v-model="formDate.changeMonth" style="width:363px">
              <Option v-for="item in monthListaa" :value="item" :key="item">{{ item }}</Option>
            </Select>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="7" class="ivu-form-item-label">社区变更操作人：</Col>
          <Col span="9" offset="1">
            <Input v-model="formDate.committeeChangeHandler" ></Input>
          </Col>
        </Row>
        <Row class="mb20">
          <Col span="7" class="ivu-form-item-label">社区负责人：</Col>
          <Col span="9" offset="1">
            <Input v-model="formDate.committeePrincipal"></Input>
          </Col>
        </Row>
        <center>
          <span style="color: red">提示:由于申请人信息变更，此变更申请信息由市级审批完成后，此申请人变更月份后资金本次不生成，由下季度补发</span>
        </center>
        <Row class="mb20">
          <Col span="13" class="ivu-form-item-label">
            <Button @click="save()">提交</Button>
          </Col>
        </Row>
    </Form>
  </div>
</template>
<script>
// import { itemParamByOrderList } from '@/api/eventlist'
export default {
  name: 'Form11',
  data () {
    return {
      bwk: '0',
      paramsArr: [],
      list: [],
      sectionList: [],
      streetList: [],
      committeesList: [],
      batchList: [],
      month_list: [],
      committeeChangeReasonArr: []
    }
  },
  props: {
    formDate: Object,
    tempData: Object,
    ruleData: Object,
    monthListaa: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  mounted () {
    console.log(this.ruleData, 'this.ruleData')
    // this.rowList()
  },
  watch: {
    // params (ret) {
    //   console.log(ret)
    // }
  },
  methods: {
    save () {
      this.formDate.committeeChangeReasonId = this.committeeChangeReasonArr.join(',')
      if (!this.formDate.committeeChangeReasonId) {
        this.$Notice.error({ title: '请选择变更原因', desc: '' })
        return false
      } else if (!this.formDate.committeeChangeReason) {
        this.$Notice.error({ title: '请选择变更原因说明', desc: '' })
      } else if (!this.formDate.changeMonth) {
        this.$Notice.error({ title: '请选择变更月份', desc: '' })
      } else if (!this.formDate.committeeChangeHandler) {
        this.$Notice.error({ title: '请填写社区变更操作人', desc: '' })
      } else if (!this.formDate.committeePrincipal) {
        this.$Notice.error({ title: '请填写社区负责人', desc: '' })
      } else {
        console.log(this.formDate)
        this.$emit('ee')
      }
    }
  }
}
</script>
